<template>
    <div id="zhuanye">
        <top-nav></top-nav>
        <div class="main">
            <fu-gai-lv></fu-gai-lv>
            <SuiJi></SuiJi>
            <jian-du></jian-du>
        </div>
    </div>
</template>

<script>
    import TopNav from "@/components/zhuanye/TopNav";
    import SuiJi from "@/components/zhuanye/SuiJi";
    import JianDu from "@/components/zhuanye/JianDu";
    import FuGaiLv from "@/components/zhuanye/FuGaiLv";
    import Bus from '@/plugs/bus'

    export default {
        name: "zhuanye",
        data() {
            return {};
        },
        components: {
            TopNav,
            SuiJi,
            JianDu,
            FuGaiLv,
        },
        methods: {
            chuangkouChange() {
                //根据窗口的大小变动图表
                window.onresize = () => {
                    Bus.$emit('changeSize', true);
                };
            },
        },
        mounted() {
            this.chuangkouChange();
        },
        created() {

        }
    };
</script>
<style lang="less" scoped>
    #zhuanye {
        height: calc(100vh - 6.3rem);
        background-color: #04113bc4;
        padding: 0 1.625rem 1.6rem;
        display: grid;
        grid-template-rows: repeat(6, 16.6%);
        grid-template-columns: repeat(3, 1fr);

        .main {
            grid-column: 1 / span 4;
            grid-row: 2 / span 5;
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1%;
            padding-top: 1%;
        }
    }
</style>
